<template>
  <div class="app">
    <h4>这是App组件</h4>
  </div>
</template>

<script>
import { reactive,ref, toRefs ,readonly,isRef ,isReactive,isReadonly,isProxy} from "vue";
export default {
  name: "App",
  setup() {
    let car = reactive({ name: "奔驰", price: 40 });
    let sum = ref(0)
    let car_2 = readonly(car)

    console.log('isRef(sum) :>> ', isRef(sum));
    console.log('isReactive(car) :>> ', isReactive(car));
    console.log('isReadonly(car) :>> ', isReadonly(car));
    console.log('isProxy() :>> ', isProxy(car));

    

    return { ...toRefs(car),car_2 };
  },
};
</script>

<style scoped>
.app {
  background-color: gray;
  padding: 15px;
}
</style>
